
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script language="JavaScript">
	//ajax方式，与nutz通讯  
	var xmlHttp = false;
	try {
		xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
	} catch (e) {
		try {
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
		} catch (e2) {
			xmlHttp = false;
		}
	}
	if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
		xmlHttp = new XMLHttpRequest();
	}

	function init() {

		var url = "display";
		xmlHttp.open("POST", url, true);//提交数据  
		xmlHttp.onreadystatechange = function() {//服务器返回状态  
			//服务成功接收并受回数据  
			if (xmlHttp.readyState == 4) {
				eval("json=" + xmlHttp.responseText + ";");
				eval("json=" + json + ";");
				var len = json.length;

				//动态创建table  
				var strTbody = [ "<table border='1'><tbody>" ];//定义数组  
				strTbody.push("<tr>");
				strTbody.push("<td>姓名</td>");
				strTbody.push("<td>年龄</td>");
				strTbody.push("<td>&nbsp;</td>");
				strTbody.push("<td>&nbsp;</td>");
				strTbody.push("</tr>");

				strTbody.push("<tr>");
				strTbody.push("<td><input name='bs1' type='text'  ></td>");
				strTbody.push("<td><input name='bs1' type='text'  ></td>");
				strTbody
						.push("<td><input name='add' type='button' id='add' value='增加' onClick='addLine(this)'></td>");
				strTbody.push("<td>&nbsp;</td>");
				strTbody.push("</tr>");

				for (var i = 0; i < json.length; i++) {
					strTbody.push("<tr>");

					strTbody
							.push("<td><input name='bs1' type='text' value='"+json[i].name+"' ></td>");
					strTbody
							.push("<td><input name='bs2' type='text' value='"+json[i].age+"' ></td>");
					strTbody.push("<td>");
					strTbody
							.push("<input name='add' type='button' id='add' value='更新' onClick='updata(this)'>");
					strTbody.push("</td>");
					strTbody.push("<td>");
					strTbody
							.push("<input name='delete' type='button' id='delete' value='删除' onClick='deldata(this)'>");
					strTbody.push("</td>");

					strTbody.push("</tr>");

				}
				strTbody.push("</tbody></table>");
				var obj = document.getElementById("tableDiv");
				obj.innerHTML = strTbody.join("");

			}
		}
		xmlHttp.send(null);
	}

	function addLine(obj) {
		var objSourceRow = obj.parentNode.parentNode;
		var objTable = obj.parentNode.parentNode.parentNode.parentNode;
		var row_num = objTable.rows.length;
		var cell_num = objTable.rows[0].cells.length;
		var objRow = objTable.insertRow(row_num);

		var str = "?name=" + objSourceRow.cells[0].firstChild.value + "";
		str += "&age=" + objSourceRow.cells[1].firstChild.value + "";

		var url = "insert" + str;
		xmlHttp.open("POST", url, true);//提交数据  
		xmlHttp.onreadystatechange = function() {//服务器返回状态  
			//服务成功接收并返回数据  
			if (xmlHttp.readyState == 4) {
				init();
				alert(xmlHttp.responseText);
			}
		}
		xmlHttp.send(null);
	}
	function updata(obj) {
		var objSourceRow = obj.parentNode.parentNode;
		var objTable = obj.parentNode.parentNode.parentNode.parentNode;
		var row_num = objTable.rows.length;
		var cell_num = objTable.rows[0].cells.length;

		var str = "?name=" + objSourceRow.cells[0].firstChild.value + "";
		str += "&age=" + objSourceRow.cells[1].firstChild.value + "";

		var url = "update" + str;
		xmlHttp.open("POST", url, true);//提交数据  
		xmlHttp.onreadystatechange = function() {//服务器返回状态  
			//服务成功接收并返回数据  
			if (xmlHttp.readyState == 4) {
				init();
				alert(xmlHttp.responseText);
			}
		}
		xmlHttp.send(null);
	}
	function deldata(obj) {
		var objSourceRow = obj.parentNode.parentNode;
		var objTable = obj.parentNode.parentNode.parentNode.parentNode;
		var row_num = objTable.rows.length;
		var cell_num = objTable.rows[0].cells.length;

		var str = "?name=" + objSourceRow.cells[0].firstChild.value + "";
		str += "&age=" + objSourceRow.cells[1].firstChild.value + "";

		var url = "delete" + str;
		xmlHttp.open("POST", url, true);//提交数据  
		xmlHttp.onreadystatechange = function() {//服务器返回状态  
			//服务成功接收并返回数据  
			if (xmlHttp.readyState == 4) {
				init();
				alert(xmlHttp.responseText);
			}
		}
		xmlHttp.send(null);
	}
//-->
</script>
</head>
<body onload="init();">
	<div id="tableDiv"></div>
</body>
</html>
